<template>
  <view class="content">
    <view class="nav">
      <block v-for="(item, index) in navList" :key="index">
        <view
          class="data"
          :class="
            index >= navList.length - (navList.length % 4 ? 0 : 4)
              ? 'datas'
              : ''
          "
          @click="onWebView(item)"
        >
          <view class="icon">
            <image :src="item.icon" class="images"></image>
            <image :src="item.picon" v-if="item.picon" class="image-p"></image>
          </view>
          <view class="text">
            {{ item.title }}
          </view>
        </view>
      </block>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      allMoudles: [
        {
          title: "我要捐款",
          code: "wyjk",
          icon: "/static/server/my1.png", //控制定位的icon
          url: "https://app15.hzgsredcross.org.cn/JKDetailInfo/IndexNew?par=zonghe", //所要跳转的url地址
        },
        {
          title: "我要捐物",
          code: "wyjw",
          icon: "/static/server/my2.png", //控制定位的icon
          url: "https://app15.hzgsredcross.org.cn/JwProjectInfo/IndexNew?par=zonghe", //所要跳转的url地址
        },
        {
          title: "个人入会",
          code: "grrh",
          icon: "/static/server/my3.png", //控制定位的icon
          url: "https://www.redcross668.com/Login/Register?areaId=940", //所要跳转的url地址
        },
        {
          title: "成为志愿者",
          code: "cwzyz",
          icon: "/static/server/recently2.png", //控制定位的icon
          url: "https://www.redcross668.com/Users/HyVolunteer/Index?areaId=940", //所要跳转的url地址
        },
        {
          title: "志愿者活动",
          code: "zyzhd",
          icon: "/static/server/recently3.png", //控制定位的icon
          url: "https://www.redcross668.com/HyActivityIndex/Index?areaId=940", //所要跳转的url地址
        },
        {
          title: "加入志愿者队伍",
          code: "jrzyzdw",
          icon: "/static/server/icon9.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "会员活动",
          code: "hyhd",
          icon: "/static/server/recently1.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "团体入会",
          code: "ttrh",
          icon: "/static/server/my4.png", //控制定位的icon
          url: "https://www.redcross668.com/Login/TeamRegist?areaId=940", //所要跳转的url地址
        },
        {
          title: "我要求助",
          code: "wyqz",
          icon: "/static/server/my5.png", //控制定位的icon
          url: "https://www.redcross668.com/HyMemProjectInfoIndex/index", //所要跳转的url地址
        },
        // {
        //   title: "捐物记录",
        //   code: "jwjl",
        //   icon: "/static/server/my6.png", //控制定位的icon
        //   url: "https://app15.hzgsredcross.org.cn/Jw/JkInfo/MyListNew", //所要跳转的url地址
        // },
        // {
        //   title: "捐款记录",
        //   code: "jkjl",
        //   icon: "/static/server/my7.png", //控制定位的icon
        //   url: "https://app15.hzgsredcross.org.cn/Jw/JwProjectDonate/MyListNew ", //所要跳转的url地址
        // },
        {
          title: "集锦秀",
          code: "jjx",
          icon: "/static/server/recently4.png", //控制定位的icon
          url: "https://www.redcross668.com/Users/HyFriendMessage/Add", //所要跳转的url地址
        },
        {
          title: "器官（遗体、组织）",
          code: "qgytzz",
          icon: "/static/server/recommend1.png", //控制定位的icon
          url: "http://app22.hzgsredcross.org.cn/addqgjx.aspx?quId=1", //所要跳转的url地址
        },
        {
          title: "一键呼救",
          code: "yjhh",
          icon: "/static/server/recommend2.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        // {
        //   title: "救援记录",
        //   code: "jyjl",
        //   icon: "/static/server/recommend3.png", //控制定位的icon
        //   url: "https://hzgsapp3.hzgsredcross.org.cn/Rescue/User/MyResAnswer.aspx", //所要跳转的url地址
        // },
        {
          title: "呼救记录",
          code: "hjjl",
          icon: "/static/server/recommend4.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "我要发表文章",
          code: "wyfbwz",
          icon: "/static/server/icon1.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "我要建议",
          code: "wyjy",
          icon: "/static/server/icon2.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "在线学习",
          code: "zxxx",
          icon: "/static/server/icon3.png", //控制定位的icon
          url: "http://app22.hzgsredcross.org.cn/StudyVideoList.aspx?quId=1&ctId=1", //所要跳转的url地址
        },
        {
          title: "申领急救物资",
          code: "sljjwz",
          icon: "/static/server/icon4.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "救护E站",
          code: "jhez",
          icon: "/static/server/icon5.png", //控制定位的icon
          url: "https://app31.hzgsredcross.org.cn/Scenice/default", //所要跳转的url地址
        },
        {
          title: "联系红会",
          code: "lxhh",
          icon: "/static/server/icon6.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "博爱家园",
          code: "bajy",
          icon: "/static/server/icon7.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "积分商城",
          code: "jfsc",
          icon: "/static/server/icon8.png", //控制定位的icon
          url: "https://www.redcross668.com/productIndex/list?areaId=940", //所要跳转的url地址
        },
        {
          title: "救护员培训报名",
          code: "jhypxbm",
          icon: "/static/server/icon10.png", //控制定位的icon
          url: "https://app22.hzgsredcross.org.cn/index.aspx", //所要跳转的url地址
        },
        // {
        //   title: "培训记录",
        //   code: "pxjl",
        //   icon: "/static/server/icon11.png", //控制定位的icon
        //   url: "http://app22.hzgsredcross.org.cn/User/LifeGuardExamRecord.aspx", //所要跳转的url地址
        // },
        {
          title: "我要开票",
          code: "wykp",
          icon: "/static/server/icon12.png", //控制定位的icon
          url: "https://app15.hzgsredcross.org.cn/Jw/JkInfo/MyListNew?par=zonghe", //所要跳转的url地址
        },
        {
          title: "我要咨询",
          code: "wyzx",
          icon: "/static/server/icon13.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        // {
        //   title: "捐赠证书",
        //   code: "jzzs",
        //   icon: "/static/server/icon14.png", //控制定位的icon
        //   url: "", //所要跳转的url地址
        // },
        // {
        //   title: "积分记录",
        //   code: "jfjl",
        //   icon: "/static/server/icon15.png", //控制定位的icon
        //   url: "", //所要跳转的url地址
        // },
        {
          title: "查找AED",
          code: "czaed",
          icon: "/static/server/icon16.png", //控制定位的icon
          url: "https://aedmap.redcross668.com/index/aed/amap", //所要跳转的url地址
        },
        {
          title: "造血干细胞捐献意向登记",
          code: "zxgxbjxyxdj",
          icon: "/static/server/icon17.png", //控制定位的icon
          url: "http://app22.hzgsredcross.org.cn/addzxgxb.aspx?quId=1", //所要跳转的url地址
        },
        {
          title: "个人转会",
          code: "grzh",
          icon: "/static/server/icon18.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "团体转会",
          code: "ttzh",
          icon: "/static/server/icon19.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "缴纳会费",
          code: "jnhf",
          icon: "/static/server/icon20.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
        {
          title: "智慧红十字一体机",
          code: "zhhszhytj",
          icon: "/static/server/icon21.png", //控制定位的icon
          url: "", //所要跳转的url地址
        },
		{
		  title: "成为急救侠",
		  code: "cwjjx",
		  icon: "/static/server/icon22.png", //控制定位的icon
		  url: "https://app15.hzgsredcross.org.cn/jh/help/help.html?returnUrl=https://hzgsapp3.hzgsredcross.org.cn/Home.aspx", //所要跳转的url地址
		},
		{
		  title: "加入救援队",
		  code: "jrjyd",
		  icon: "/static/server/icon23.png", //控制定位的icon
		  url: "", //所要跳转的url地址
		},
        // ,{
        // 	title: '更多应用',
        // 	icon: '/static/server/my8.png', //控制定位的icon
        // 	url: '', //所要跳转的url地址
        // }
      ],
      //10导航直接跳页面的
      navList: [
        {
          title: "更多",
          icon: "/static/home/more.png", //控制定位的icon
          picon: "/static/home/more-0.png", //被定位的icon
          isLocal: "more", //是否是本地
          local: "/pages/serve/serve", //所要跳转的url地址
        },
      ],
    };
  },
  onLoad() {},
  onShow() {},
  mounted() {
    //this.getMyMoudles();
    this.getRecentMoudles();
  },
  methods: {
    //获取最近使用
    getRecentMoudles() {
      let userInfo = uni.getStorageSync("userInfo");
      if (!userInfo) {
        this.mathDefaultMoudles();
        return;
      }
      uni.request({
        url: "http://redcrossadmin.isaw.top/api/Moudle/GetMyRecentMoudles", //仅为示例，并非真实接口地址。
        data: {},
        method: "GET",
        header: {
          Authorization: userInfo.token,
        },
        success: (res) => {
          if (res.data.code == 1) {
            this.navList = [];
			var l= res.data.data.length;
			if(l>7){
				l=7;
			}
            for (var i = 0; i < l; i++) {
              for (var j = 0; j < this.allMoudles.length; j++) {
                if (res.data.data[i] == this.allMoudles[j].code) {
                  this.navList.push(this.allMoudles[j]);
                  break;
                }
              }
            }

            if (this.navList.length < 7) {
              for (var j = 0; j < this.allMoudles.length; j++) {
                var has = false;
                for (var i = 0; i < this.navList.length; i++) {
                  if (this.allMoudles[j].code == this.navList[i].code) {
                    has = true;
                  }
                }
                if (!has) {
                  this.navList.push(this.allMoudles[j]);
                  if (this.navList.length >= 7) {
                    break;
                  }
                }
              }
            }

            this.navList.push({
              title: "更多",
              icon: "/static/home/more.png", //控制定位的icon
              picon: "/static/home/more-0.png", //被定位的icon
              isLocal: "more", //是否是本地
              local: "/pages/serve/serve", //所要跳转的url地址
            });
          }
        },
      });
    },
    mathDefaultMoudles() {
      this.navList = [];
      for (var i = 0; i < 7; i++) {
        this.navList.push(this.allMoudles[i]);
      }
      this.navList.push({
        title: "更多",
        icon: "/static/home/more.png", //控制定位的icon
        picon: "/static/home/more-0.png", //被定位的icon
        isLocal: "more", //是否是本地
        local: "/pages/serve/serve", //所要跳转的url地址
      });
    },
    //获取我的应用
    getMyMoudles() {
      let userInfo = uni.getStorageSync("userInfo");
      if (!userInfo) {
        this.mathDefaultMoudles();
        return;
      }
      uni.request({
        url: "http://redcrossadmin.isaw.top/api/Moudle/GetMyMoudles", //仅为示例，并非真实接口地址。
        data: {},
        method: "GET",
        header: {
          Authorization: userInfo.token,
        },
        success: (res) => {
          if (res.data.code == 1) {
            this.islogined = true;
            this.navList = [];
            var len = res.data.data.length;
            if (len > 7) {
              len = 7;
            }
            for (var i = 0; i < len; i++) {
              for (var j = 0; j < this.allMoudles.length; j++) {
                if (res.data.data[i] == this.allMoudles[j].code) {
                  this.navList.push(this.allMoudles[j]);
                  break;
                }
              }
            }
            this.navList.push({
              title: "更多",
              icon: "/static/home/more.png", //控制定位的icon
              picon: "/static/home/more-0.png", //被定位的icon
              isLocal: "more", //是否是本地
              local: "/pages/serve/serve", //所要跳转的url地址
            });
          }
        },
      });
    },

    //跳第三方页面
    onWebView({ url, isLocal, local, code }) {
      // #ifdef  H5

      if (local) {
        uni.switchTab({
          url: "/pages/serve/serve",
        });
        return;
      }

      let userInfo = uni.getStorageSync("userInfo");
      if (userInfo) {
        uni.request({
          url: "http://redcrossadmin.isaw.top/api/Moudle/VisitMoudle", //仅为示例，并非真实接口地址。
          data: {
            moudleCode: code,
          },
          method: "POST",
          header: {
            Authorization: userInfo.token,
          },
          success: (res) => {
              this.jumpUrl(url, code);
          },
        });
      } else {
          this.jumpUrl(url, code);
      }
      // #endif
    },
    jumpUrl(url, code) {
      if (["wyjw", "wyjk", "wykp","cwjjx"].indexOf(code) >= 0) {
        this.avoidLogin(url);
      }else if(["jhypxbm","zxgxbjxyxdj","qgytzz"].indexOf(code) >= 0){
      		  this.app22AvoidLogin(url);
      } else {
        if(url){
        	 window.location.href = url;
        }else{
        	uni.showModal({
        	  title: "提示",
        	  content: "此功能暂未开放，敬请期待 ！",
        	  success: function (res) {
        	    if (res.confirm) {
        	      console.log("用户点击确定");
        	    } else if (res.cancel) {
        	      console.log("用户点击取消");
        	    }
        	  },
        	});
        }
      }
    },
	app22AvoidLogin(url) {
	  return new Promise((resolve) => {
	    let userInfo = uni.getStorageSync("userInfo");
	    if (!userInfo) {
	      uni.navigateTo({
	        url: "/pages/login/login",
	      });
	      return;
	    }
	    uni.request({
	      url: "http://redcrossadmin.isaw.top/api/Login/App22AvoidLoginSign", //仅为示例，并非真实接口地址。
	      data: {
	        redirectUrl: url,
	      },
	      method: "POST",
	      header: {
	        Authorization: userInfo.token,
	      },
	      success: (res) => {
	        if (res.data.code == 1) {
	          var href =
	            "http://app22.hzgsredcross.org.cn/publicInterface/HhMLogin.aspx?mobile=" +
	            res.data.data.model.mobile +
	            "&nickname=" +
	            res.data.data.model.nickname +
	            "&idCard=" +
	            res.data.data.model.idCard +
	            "&sign=" +
	            res.data.data.sign +
	            "&redirectUrl=" +
	            url;
	          //console.log(href);
	          window.location.href = href;
	        }
	      },
	    });
	  }).catch((e) => {});
	},
    avoidLogin(url) {
      return new Promise((resolve) => {
        let userInfo = uni.getStorageSync("userInfo");
        if (!userInfo) {
          uni.navigateTo({
            url: "/pages/login/login",
          });
          return;
        }
        uni.request({
          url: "http://redcrossadmin.isaw.top/api/Login/AvoidLoginSign", //仅为示例，并非真实接口地址。
          data: {
            redirectUrl: url,
          },
          method: "POST",
          header: {
            Authorization: userInfo.token,
          },
          success: (res) => {
            if (res.data.code == 1) {
              var href =
                "https://app15.hzgsredcross.org.cn/Home/ZHHT?mobile=" +
                res.data.data.model.mobile +
                "&nickname=" +
                res.data.data.model.nickname +
                "&timestamp=" +
                res.data.data.model.timestamp +
                "&sign=" +
                res.data.data.sign +
                "&redirectUrl=" +
                url;
              //console.log(href);
              window.location.href = href;
            }
          },
        });
      }).catch((e) => {});
    },
  },
};
</script>

<style lang="scss" scoped>
.content {
  margin: 0 0 30rpx 0;
  padding: 16rpx 24rpx 0rpx 24rpx;
  .nav {
    width: auto;
    min-height: 200rpx;
    background: #ffffff;
    box-shadow: 0px 3rpx 18rpx 0px rgba(79, 108, 254, 0.43);
    border-radius: 5rpx;
    display: flex;
    justify-content: flex-start;
    white-space: nowrap;
    flex-wrap: wrap;
    .data {
      padding-top: 26rpx;
      flex-basis: 25%;
      max-width: 25%;
      flex-grow: 1;
      box-sizing: border-box;
      .icon {
        text-align: center;
        position: relative;
        .images {
          width: 45rpx;
          height: 43rpx;
        }
        .image-p {
          width: 27rpx;
          height: 27rpx;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -55%);
        }
      }
      .text {
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: center;
        font-size: 24rpx;
        font-family: PingFang;
        font-weight: bold;
        color: #222222;
        padding: 19rpx 10rpx 11rpx 10rpx;
      }
    }
    .datas {
      padding-bottom: 26rpx;
    }
  }
}
</style>
